<template>
  <div style="height:330px" class="SelectListDimension-page">
    <!-- 搜索区域 -->
    <SelfAdaption>
      <Form
        :model="searchForm"
        ref="searchForm"
        slot="adaption-bar"
        label-position="top"
        class="ivu-form-no-margin-bottom"
        inline
      >
        <!-- 名称 -->
        <Form-item prop="name" :label="$t('module.dimension.name')">
          <Input type="text" :maxlength="30" v-model="searchForm.name"  @on-enter="search" />
        </Form-item>
        <!-- 编码 -->
        <Form-item prop="code" :label="$t('module.dimension.code')">
          <Input type="text" :maxlength="30" v-model="searchForm.code"  @on-enter="search" />
        </Form-item>

        <!-- 查询\重置按钮 -->
        <Form-item prop="button" class="search-solt-btn">  
          <RPButton optType="search"  @click="search" />
          <RPButton optType="reset"  @click="reset" />
        </Form-item>
      </Form>
    </SelfAdaption>
    <InnerPageTable ref="listDataTable" :config="tableConfig">
      <!--
      <div slot="handle-bar">
        <RPButton optType="search"  @click="search" />
        <RPButton optType="reset"  @click="reset" />
      </div>
      -->
    </InnerPageTable>
  </div>
</template>
<script>
import { queryListDimensionData } from "@/api/dimensionApi.js";
import { dimensionSelectColumns } from "./columns.js";
import locales from "./locales.js";

export default {
  mixins: [locales],
  props: {
    roleId: {
      type: String,
      default: ""
    },
    tenantCode: {
      type: String,
      default: ""
    },
    dimensionId: {
      type: String,
      default: ""
    },
    dimensionCode: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      searchForm: {
        roleId: this.roleId,
        tenantCode: this.tenantCode,
        dimensionCode: this.dimensionCode,
        dimensionId: this.dimensionId,
        name: "",
        code: ""
      },
      resource: []
    };
  },
  computed: {
    tableConfig() {
      return {
        loadDataFn: queryListDimensionData,
        columnsFn: dimensionSelectColumns.bind(this),
        autoFirst: true,
        initParam: this.searchForm
      };
    }
  },
  created() {
    this.init();
  },
  methods: {
    init() {
      this.$emit("SetTitle", this.$t('module.role.selData'));
      this.$emit("SetPageWidth", 838);
      this.$emit("SetPageActions", [
        {
          text: this.$t("common.save"),
          theme: "primary",
          handle: () => {
            this.confirm();
          }
        },
        {
          text: this.$t("common.close"),
          handle: () => {
            this.$emit("Close");
          }
        }
      ]);
    },
    search(page) {
      this.$refs["listDataTable"].load(this.searchForm, page);
    },
    reset() {
      this.$refs["searchForm"].resetFields();
      this.search(1);
    },
    confirm() {
      let selectedData = this.$refs["listDataTable"].getSelectioned();
      this.$emit("Close", selectedData);
    }
  },
  watch: {},
  directives: {}
};

const o1 = { l: { a: 1, b: 1 }, b: { c: 1 } };
const o2 = { b: { b: 2, d: 1 } };
</script>
<style lang="less">
// ok统一注释的样式
// .SelectListDimension-page {
//   .run-search-bar>div:last-child {
//       margin-top: 10px!important;
//   }
// }
</style>